<template>
    <view class="appCode">
        <view
            class="share_wx"
            v-if="shareStu"
            @click="shareStu = false"
            @touchmove.prevent
        >
            <img src="https://oss-shop.cciinet.com/files/MiniProgram/share_wx2.png" alt="" />
        </view>
        <view class="btn">
            <i class="b"></i>
            <text class="h2">点击下方按钮下载冻品交易港APP</text>
            <view class="content">
                <button
                    @click="
                        down(
                            1,
                            'https://oss-shop.cciinet.com/files/frozenApp/app-release.apk'
                        )
                    "
                >
                    <i class="a"></i>
                    <span class="span">Android</span>
                </button>
                <button
                    @click="
                        down(2, 'https://apps.apple.com/us/app/%E5%86%BB%E5%93%81%E4%BA%A4%E6%98%93%E6%B8%AF/id1555641756')
                    "
                >
                    <i class="i"></i>
                    <span class="span">iPhone</span>
                </button>
            </view>
        </view>
    </view>
</template>
<script>
export default {
    name: "Code",
    // created() {
    //     // window.title="Coldeal"
    // },
    data() {
        return{
            shareStu:false,
        }
    },
	mounted() {
		document.getElementsByClassName('appCode')[0].style.height = document.body.clientHeight+'px'
	},
    methods: {
        down(s, a) {
            var u = navigator.userAgent;
            var ua = navigator.userAgent.toLowerCase();
            var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //android终端
            var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
             if (ua.match(/MicroMessenger/i) == "micromessenger"&&isAndroid&&s == 1) {
                    this.shareStu = true
                    return
            }
            if ((isAndroid && s == 2) || (isiOS && s == 1)) {
               
                alert(
                    "请选择相应的系统下载:" + (s == 2 ? "Android" : "iPhone")
                );
                return;
            }
            window.open(a);
        },
    },
};
</script>
<style lang="scss" scoped>
@keyframes myMove {
    0% {
        margin-bottom: 30px;
    }
    100% {
        margin-bottom: 50px;
    }
}
.appCode {
    .share_wx {
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.75);
        overflow: hidden;
        position: fixed;
        z-index: 99;
        img {
            width: 50%;
            position: absolute;
            top: 11upx;
            right: 141upx;
        }
    }
    width: 100%;
    height: 100%;
    background: url("https://oss-shop.cciinet.com/files/MiniProgram/appCode.png") no-repeat center center;
    background-size: cover;
    position: relative;
    .btn {
        white-space: nowrap;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        bottom: 25%;
        text-align: center;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
        .b {
            width: 31upx;
            height: 31upx;
            display: inline-block;
            background: url("https://oss-shop.cciinet.com/files/MiniProgram/app_b.png") no-repeat center center;
            background-size: 100% 100%;
            animation: myMove 0.5s linear infinite alternate;
        }
        .h2 {
            font-size: 28upx;
            font-family: Adobe Heiti Std;
            font-weight: bold;
            color: #ffffff;
            line-height: 1;
        }

        .content {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-top: 49upx;
            button:active {
                background: rgba(0, 0, 0, 0.2);
                span {
                    color: #fff;
                }
            }
            button {
                transition: 0.1s;
                width: 380upx;
                height: 80upx;
                background: #ffffff;
                border-radius: 40upx;
                margin-bottom: 33upx;
                display: flex;
                align-items: center;
                justify-content: center;
                .a {
                    width: 43upx;
                    height: 49upx;
                    display: inline-block;
                    background: url("https://oss-shop.cciinet.com/files/MiniProgram/app_a.png") no-repeat center center;
                    background-size: 100% 100%;
                }
                .i {
                    width: 43upx;
                    height: 49upx;
                    display: inline-block;
                    background: url("https://oss-shop.cciinet.com/files/MiniProgram/app_i.png") no-repeat center center;
                    background-size: 100% 100%;
                }
                .span {
                    font-size: 30upx;
                    font-family: Adobe Heiti Std;
                    font-weight: normal;
                    color: #000000;
                    margin-left: 23upx;
                }
            }
        }
    }
}
</style>